<%--
  @author Supun Viraj Rathnayaka
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/dateSelector.js"></script>
<script type="text/javascript">
    $(function () {
        $('.land-table').dataTable({
            "sPaginationType": "full_numbers",
            "bDestroy": true,
            "oLanguage": {
                "sZeroRecords": $('#no-record').val(),
                "sLengthMenu": $('#display').val() + " _MENU_ " + $('#records').val(),
                "sSearch": $('#search').val(),
                "sInfo": $('#showing').val() + " _START_ " + $('#to').val() + " _END_ " + $('#of').val() + " _TOTAL_ " + $('#entries').val(),
                "sInfoEmpty": $('#no-record').val(),
                "oPaginate": {
                    "sFirst": $('#first').val(),
                    "sLast": $('#last').val(),
                    "sNext": $('#next').val(),
                    "sPrevious": $('#previous').val()
                }
            },
            "fnDrawCallback": function() {
                if ($('.dataTables_paginate span span.paginate_button').size()) {
                    $('.dataTables_paginate')[0].style.display = "block";
                } else {
                    $('.dataTables_paginate')[0].style.display = "none";
                }
            }
        });


        validateDetails();
    });

    function validateDetails() {

        $('#taxStartDate').rules("add", {
            isDateFormated: true,
            required: true

        });

        $('#taxPercentage').rules("add", {
            required: true
        });
    }
</script>

<div id="land-registration-module-home-title" class="module-home-title">
    <s:a href="paymentModule.do">
        <span><img src="${pageContext.request.contextPath}/images/payment.png" alt="Land Registration">
            <s:label value="%{getText('land_payments_module.label')}"/></span>
    </s:a>
    <span class="module-title-breaker"></span>
    <s:a href="detailForm.do">
        <span><img src="${pageContext.request.contextPath}/images/monthly-rent.png" alt="Enter Detailed Land Information">
            <s:label value="Taxation"/></span>
    </s:a>
    <div id="back-button" align="right">
        <s:form><s:submit value="%{getText('back_btn.label')}" action="landRegistrationModule"/></s:form>
    </div>
</div>
<div id="detail-land-update-list">
    <div class="page-title">
        <h2><s:label value="Taxation Data"/></h2>
    </div>
    <s:if test="hasActionErrors() || hasActionMessages()">
        <div id="message-box" class="message-box">
            <div class="action-msg"><s:actionmessage/></div>
            <div class="action-err"><s:actionerror/></div>
        </div>
    </s:if>
    <div id="tax-form">
        <table>
        <s:form>
            <tr><td colspan="5"><s:label value="%{getText('Add New')}"/></td></tr>
            <tr>
                    <td><s:label value="%{getText('Imposed Date')}"/><span class="mandatory-field"></span></td>
                    <td><s:textfield name="taxation.startDate" id="taxStartDate" onclick="selectDate('taxStartDate')"
                            onKeyPress="return dateNumbersOnly(event,true)"/></td>
                     <td><s:label value="%{getText('Tax Percentage')}"/><span class="mandatory-field"></span></td>
                    <td><s:textfield name="taxation.taxPercentage" id="taxPercentage"/></td>
                    <td><s:submit value="%{getText('Add')}" action="addTaxation" onclick="validateDetails()"/></td>
            </tr>
            <%--<tr>
                    <td><s:label value="%{getText('Tax Percentage')}"/><span class="mandatory-field"></span></td>
                    <td><s:textfield name="taxPercentage" id="taxPercentage"/></td>
            </tr>
            <tr>
                    <td colspan="2"><s:submit value="%{getText('Add')}" action="addTaxation.do" onclick="validateDetails()"/></td>
            </tr>--%>
        </s:form>
        </table>
    </div>
    <div id="tax-data">
        <table id="land-table" class="width-100 margin-10-auto table land-table">
            <thead>
            <tr>
                <th><s:label value="%{getText('id')}"/></th>
                <th><s:label value="%{getText('Start Date')}"/></th>
                <th><s:label value="%{getText('End Date')}"/></th>
                <th><s:label value="%{getText('Tax Percentage')}"/></th>
            </tr>
            </thead>
            <tbody>
            <s:iterator status="lands" value="taxList">
                <tr>
                    <td width="80px"><s:property value="id"/></td>
                    <td><s:property value="startDate"/></td>
                    <td><s:property value="endDate"/></td>
                    <td width="80px"><s:property value="taxPercentage"/></td>
                </tr>
            </s:iterator>
            </tbody>
        </table>
    </div>
</div>

<%-- Localization text for data tables --%>
<s:hidden id="display" value="%{getText('display.label')}"/>
<s:hidden id="records" value="%{getText('records.label')}"/>
<s:hidden id="search" value="%{getText('search.label')}"/>
<s:hidden id="no-record" value="%{getText('no_record.label')}"/>
<s:hidden id="showing" value="%{getText('showing.label')}"/>
<s:hidden id="to" value="%{getText('to.label')}"/>
<s:hidden id="of" value="%{getText('of.label')}"/>
<s:hidden id="entries" value="%{getText('entries.label')}"/>
<s:hidden id="first" value="%{getText('first.label')}"/>
<s:hidden id="last" value="%{getText('last.label')}"/>
<s:hidden id="next" value="%{getText('next.label')}"/>
<s:hidden id="previous" value="%{getText('previous.label')}"/>